<template>
  <div class="app-container preview">
      <mavon-editor
        class="md"
        :value="readmeContent"
        :subfield="false"
        :defaultOpen="'preview'"
        :toolbarsFlag="false"
        :editable="false"
        :scrollStyle="true"
        :ishljs="true"
      ></mavon-editor>
  </div>
</template>

<script>
import { getEssayById } from '@/api/modules/blog'
export default {
  name: 'preview',
  data () {
    return {
      readmeContent: '',
      params: {
        pageView:true
      }
    }
  },
  created () {
    Object.assign(this.params, this.$route.params)
    this.fetch()
  },
  methods: {
    async fetch () {
      const res = await getEssayById(this.params)
      this.readmeContent = res.markdown
    }
  }
}
</script>

<style  lang="scss" scoped>
.md{
    z-index: 0 !important;
    /deep/.v-note-edit{
      height: calc(100vh - 125px);
      overflow: auto;
    }
    /deep/.v-note-show{
      height: calc(100vh - 125px);
      overflow: auto;
    }
  }
</style>
